<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>基本资料</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="../css/public.css" media="all">
    <style>
        .layui-form-item .layui-input-company {width: auto;padding-right: 10px;line-height: 38px;}
    </style>
</head>
<body>
<div id="app">
	<div class="layuimini-container">
	    <div class="layuimini-main">
	
	        <div class="layui-form layuimini-form">
				<div class="headImg" style="width: 80px;height: 80px;border-radius: 50%;margin: 30px 0 20px 15%;position: relative;">
					<span style="position: absolute;left: -80px;top:30px">头像</span>
					<img :src="user.headImg" style="width: 80px; height: 80px;border-radius: 50%;">
				</div>
	            <div class="layui-form-item">
	                <label class="layui-form-label required">管理账号</label>
	                <div class="layui-input-block">
	                    <input type="text" name="username" lay-verify="required" lay-reqtext="管理账号不能为空" placeholder="请输入管理账号"  value="admin" class="layui-input" v-model="user.uname">
	                    <tip>填写自己管理账号的名称。</tip>
	                </div>
	            </div>
	           
				<div class="layui-form-item">
				    <label class="layui-form-label required">性别</label>
				    <div class="layui-input-block">
				        <input type="radio" v-model="user.sex" name="sex" value="男" title="男" checked="">
				        <input type="radio" v-model="user.sex" name="sex" value="女" title="女">
				    </div>
				</div>
	           <div class="layui-form-item">
	               <label class="layui-form-label">年龄</label>
	               <div class="layui-input-block">
	                   <input type="text" name="age" placeholder="请输入年龄" value="" class="layui-input" v-model="user.age">
	               </div>
	           </div>
			   
<!-- 			   <div class="layui-form-item">
			       <label class="layui-form-label">id</label>
			       <div class="layui-input-block">
			           <input type="text" name="age" placeholder="请输入年龄" value="" class="layui-input" v-model="user.id">
			       </div>
			   </div> -->
			   
			   
	           <div class="layui-form-item">
	               <label class="layui-form-label">住址</label>
	               <div class="layui-input-block">
	                   <input type="text" name="name" placeholder="请输入名字" value="" class="layui-input" v-model="user.address">
	               </div>
	           </div>
	           
	           <div class="layui-form-item">
	               <label class="layui-form-label">生日</label>
	               <div class="layui-input-block">
	                   <input type="text" name="birthday" placeholder="请输入生日" value="" class="layui-input" v-model="user.birthday">
	               </div>
	           </div>
			   
			   <div class="layui-form-item">
			       <label class="layui-form-label">邮箱</label>
			       <div class="layui-input-block">
			           <input type="text" name="name" placeholder="请输入邮箱" value="" class="layui-input" v-model="user.eml">
			       </div>
			   </div>
	
	            <div class="layui-form-item">
	                <div class="layui-input-block">
	                    <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn" @click="modify()">确认保存</button>
	                </div>
	            </div>
	        </div>
	    </div>
	</div>
</div>
<script src="../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/axios.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/jquery-1.7.2.js" type="text/javascript" charset="utf-8"></script>
<script>
    layui.use(['form','miniTab'], function () {
        var form = layui.form,
            layer = layui.layer,
            miniTab = layui.miniTab;

        // //监听提交
        // form.on('submit(saveBtn)', function (data) {
        //     var index = layer.alert(JSON.stringify(data.field), {
        //         title: '最终的提交信息'
        //     }, function () {
        //         layer.close(index);
        //         miniTab.deleteCurrentByIframe();
        //     });
        //     return false;
        // });

    });
</script>


<script type="text/javascript">
	new Vue({
		el:"#app",
		data:{
			user:{},	
		},
		methods:{
			modify(){
				$.ajax({
					contentType: 'application/json;charset=UTF-8',
				    url:'http://localhost:8080/modifyUser',
				    type:'post',
				    dataType:'json',  
					data:{
						// id:this.user.id,
						// uname:this.user.uname,
						// name:this.user.name,
						// sex:this.user.sex,
						// age:this.user.age,
						// birthday:this.user.birthday
						data:JSON.stringify(this.user),
						
					},
					success:function(msg){
				    if(msg=='ok')
						{
							alert("修改成功！下次登录生效")
						}
						else{
							alert("修改失败")
						}
				  }
				})
				
			}

			
		},
		mounted:function(){
			this.user=JSON.parse(sessionStorage.getItem("user"));
			console.log(this.user)
			if(this.user!=null)
			{this.loginTrue=1;}
			//之后打开这一段 不登录就不能看了
			// else {
			// 	alert("您还未登录")
			// 	$("#app").css("display","none")
			// 	window.location='login.html'
			// }
		}

	})
</script>
</body>
</html>